<template>
    <fieldset>
        <legend>混入</legend>
        <h1>mixins</h1>
        <h1>{{ msg }}</h1>
        <h1>{{ msg2 }}</h1>
        <modal :visible="show" @confirm="confirm" @cancel="cancel"></modal>
        <button @click="handleOpenModal">点击显示模态框</button>
    </fieldset>
</template>
<script>
import m from "./m"

//1.定义布尔值赋值给组件的visible
//2.通过点击事件控制modal打开
//3.点击取消或者确定按钮需要关闭模态框
//4.注册组件

//引入自定义的modal混入选项
import modalMix from "./modalMix"
//混入的特性
//1.同名的选项会进行合并,如果属性冲突了,以组件为主

//2.同名的钩子函数会合并成一个数组,优先执行混入对象的钩子,再执行组件钩子
export default {
    name: "mixinsCom",
    //混入
    mixins: [m, modalMix],
    // data() {
    //     return {
    //         msg: '夏天的烟火一闪即逝,唯有对你的思念永远在心头'
    //     }
    // },
    // methods: {
    //     log() {
    //         console.log('组件的log方法')
    //     }
    // },
    mounted() {
        console.log('mixinsCom组件的mounted')
        // this.log()
    }
}
</script>